<div class="container">
    <a ui-sref="about" class="nav-link">About</a>
    <h2> ToDo 应用</h2>

    <form ng-submit="createTask()">
        <input class="form-control todos__create-input" placeholder="你要做什么?" ng-model="createTaskInput">
        <button type="submit1" class="btn btn-success todos__create-button">创建任务</button>
    </form>

    <table class='table table-striped'>
        <tr>
            <th>
                状态
            </th>
            <th>
                任务
            </th>
            <th>
                操作
            </th>
        </tr>
        <tr ng-repeat="todo in todos">
            <td>
                <input type="checkbox" class="todo__checkbox" ng-checked="todo.isCompleted" ng-click="onCompletedClick(todo)" />
            </td>
            <td>
                <span ng-if="!todo.isEditing" class="todos__task" ng-class="{'todos__task--completed':todo.isCompleted}">
                    {{todo.task}}
                </span>
                <form>
                    <input ng-if="todo.isEditing" class="form-control todos__update-input" ng-value="todo.task" />
                </form>
            </td>
            <td>
                <button class="btn btn-info" ng-click="onEditBtnClick(todo)">编辑</button>
                <button class="btn btn-danger">删除</button>
            </td>
        </tr>
    </table>
</div>
